<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8"/>
    <title>医保入出院及费用处理⛽️</title>
    <meta name="renderer" content="webkit"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <link rel="stylesheet" href="/lib/layui-v2.5.4/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all"/>
    <link rel="stylesheet" href="/css/public.css" media="all"/>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="/js/html5.min.js"></script>
    <script src="/js/respond.min.js"></script>
    <![endif]-->
    <!-- 自定义JS -->
    <style>
        html, body {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }

        .layui-card {
            border: 2px solid #393D49;
            border-radius: 5px;
        }

        .layui-btn {
            width: 120px;
        }

        .layui-card-body {
            position: relative;
            padding: 0px 0px;
            line-height: 20px;
            text-align: left;
        }

        .icon {
            margin-right: 10px;
            color: #1aa094;
        }

        .icon-cray {
            color: #ffb800 !important;
        }

        .icon-blue {
            color: #1e9fff !important;
        }

        .icon-tip {
            color: #ff5722 !important;
        }

        .layuimini-qiuck-module {
            text-align: center;
            margin: 0 auto;
            width: 40%;
            position: fixed;
            top: 50%; /*偏移*/
            left: 30%;
            /*transform: translateX(-50%);*/
            transform: translateY(-60%);
        }

        .layuimini-qiuck-module a i {
            display: inline-block;
            width: 100%;
            height: 60px;
            line-height: 60px;
            text-align: center;
            border-radius: 2px;
            font-size: 30px;
            background-color: #F8F8F8;
            color: #333;
            transition: all .3s;
            -webkit-transition: all .3s;
        }

        .layuimini-qiuck-module a cite {
            position: relative;
            top: 2px;
            display: block;
            color: #666;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
            font-size: 14px;
        }

        .welcome-module {
            width: 100%;
            height: 210px;
        }

        .text {
            color: #C9C9C9;
        }

        .panel {
            background-color: #fff;
            border: 1px solid transparent;
            border-radius: 3px;
            -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
            box-shadow: 0 1px 1px rgba(0, 0, 0, .05)
        }

        .panel-body {
            padding: 10px
        }


        .panel-title {
            margin-top: 0;
            margin-bottom: 0;
            font-size: 12px;
            color: inherit
        }

        .label {
            display: inline;
            font-weight: 700;
            line-height: 1;
            color: black;
            text-align: center;
            white-space: nowrap;
            padding: 9px 1px;
        }

        .layui-btn-container {
            margin-bottom: 0
        }

        .layui-btn-container .layui-btn {
            margin-right: 10px;
            margin-bottom: 0px;
        }

        .layui-card-header {
            position: relative;
            line-height: 20px;
            padding: 8px 0px;
            border-bottom: 1px solid #393D49;
            color: #333;
            border-radius: 2px 2px 0 0;
            font-size: 14px;
        }


        .layui-input {
            padding: 0 0 0 6px;
        }

        .layui-row .layui-input {
            height: 28px;
        }


    </style>
</head>
<object id="container" style="position:absolute;top:-9999px; left:-9999px">
    <object id='plugin' type='application/x-cfx'>
        <param name='plugin-version' value='7.2.50'/>
    </object>
</object>
<body>

<div class="layuimini-qiuck-module">

    <div class="layui-card ">
        <div class="layui-card-header"
             style="border-bottom:2px solid #393D49;background-color: #EFDD9C;text-align: left;height: 20px;padding-left: 10px">
            <i
                    class="fa fa-arrow-circle-down icon"></i>医保入出院及费用处理
        </div>
        <div class="layui-card-body">
            <div class="layui-form-item">
                <div class="layui-card-header" style="height: auto">
                    <div class="layui-row">
                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">卡 号:</label>
                            <div class="layui-input-inline" style="width: 56%">
                                <input type="text" id="kh"
                                       class="layui-input" readonly="readonly"></input>
                                <input type="hidden" id='mipsPaiVisitInfoId' readonly="readonly"></input>
                            </div>
                        </div>

                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">出生日期:</label>
                            <div class="layui-input-inline" style="width: 56%">
                                <input type="text" id="csrq"
                                       class="layui-input" readonly="readonly"></input>
                            </div>
                        </div>
                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">性 别:</label>
                            <div class="layui-input-inline" style="width: 54%">
                                <input type="text" id="xb"
                                       class="layui-input" readonly="readonly"></input>
                            </div>
                        </div>
                    </div>
                    <div class="layui-row">
                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">姓 名:</label>
                            <div class="layui-input-inline" style="width: 56%">
                                <input type="text" id="name"
                                       class="layui-input" readonly="readonly"></input>
                            </div>
                        </div>

                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">患者ID:</label>
                            <div class="layui-input-inline" style="width: 56%">
                                <input type="text" id="pid"
                                       class="layui-input" readonly="readonly"></input>
                            </div>
                        </div>
                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">费 别:</label>
                            <div class="layui-input-inline" style="width: 54%">
                                <input type="text" id="fb"
                                       class="layui-input" readonly="readonly"></input>
                            </div>
                        </div>
                    </div>
                    <div class="layui-row">
                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">入院日期:</label>
                            <div class="layui-input-inline" style="width: 56%">
                                <input type="text" id="ryrq"
                                       class="layui-input" readonly="readonly"></input>
                            </div>
                        </div>

                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">住院次数:</label>
                            <div class="layui-input-inline" style="width: 56%">
                                <input type="text" id="zycs"
                                       class="layui-input" readonly="readonly"></input>
                            </div>
                        </div>
                        <div class="layui-col-xs4">
                            <label class="layui-form-label label">在院状态:</label>
                            <div class="layui-input-inline" style="width: 54%">
                                <input type="text" id="zyzt"
                                       class="layui-input" readonly="readonly"></input>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-card-body" style="padding: 9px 0px 0px 0px;">
                    <div class="layui-inline">
                        <label class="layui-form-label label">住 院 号:</label>
                        <div class="layui-input-inline" style="width: 300px;">
                            <input type="text" name="patientId" id="patientId" placeholder="输入住院号回车加载患者基本信息"
                                   required="required"
                                   lay-verify="required" class="layui-input"></input>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <div class="layui-btn-container">
                            <button type="button" id="cy" class="layui-btn layui-btn-disabled" disabled="disabled">出院
                            </button>
                            <button type="button" id="qxcy" class="layui-btn layui-btn-disabled" disabled="disabled">
                                取消出院
                            </button>
                        </div>
                    </div>
                    <div class="layui-input-block">
                        <div class="layui-btn-container">
                            <button type="button" id="mxsc" class="layui-btn layui-btn-normal">明细上传</button>
                            <button type="button" id="qxmxsc" class="layui-btn layui-btn-normal">取消明细上传</button>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>

</div>

<div hidden="hidden" id="load" style="margin: 10px 10px 10px 10px">
    <form class="layui-form " action="" lay-filter="load">
        <div class="layui-form-item">
            <label id="msg">进度显示...</label>
        </div>
        <div class="layui-form-item">
            <div class="layui-progress layui-progress-big" lay-filter="demo">
                <div class="layui-progress-bar layui-bg-red" lay-percent="0%"></div>
            </div>
        </div>
    </form>
</div>
<script src="/lib/layui-v2.5.4/layui.js" charset="utf-8"></script>
<script src="/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script>
    layui.use(['form', 'table', 'layer', 'laydate', 'element'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table,
            layer = layui.layer,
            element = layui.element,
            laydate = layui.laydate;

        $("#patientId").select();
        var Interval;
        $('#patientId').on('keydown', function (event) {
            if (event.keyCode == 13) {
                var patientId = $('#patientId').val();
                if (patientId != '') {
                    load(patientId);
                } else {
                    layer.msg('请输入正确的住院号！');
                }
                return false;
            }
        });

        function load(patientId) {
            openSocket();
            var index = layer.open({
                type: 1,
                shade: 0.2,
                icon: 16,
                closeBtn: 0,
                title: false,
                content: $("#load"),
                skin: 'layui-layer-molv',
                area: "25%",
                success: function (layero, index) {
                    var n = 0;
                    Interval = setInterval(function () {
                        element.progress('demo', n + '%');
                        n = n + 2;
                        if (n >= 100) {
                            n = 0;
                        }
                    }, 100)
                }
            });
            $.ajax({
                method: "POST",
                url: "/mips/findMipsPatiInfo",
                data: {
                    patientId: patientId
                },
                success: function (obj) {
                    layer.close(index);
                    clearInterval(Interval);
                    $(":text[readonly]").each(function () {
                        $(this).val('');
                    });

                    if (obj.code == "0") {
                        if (obj.data.length > 0) {
                            setValue(obj.data[0]);
                        } else {
                            $("#cy").addClass("layui-btn-disabled").prop("disabled", true);
                            $("#qxcy").addClass("layui-btn-disabled").prop("disabled", true);
                            layer.msg("通过住院号【" + patientId + "】未获取到有效的医保信息，请检查！", function () {
                                $("#patientId").focus();
                            });
                            //layer.alert("通过住院号【" + patientId + "】未获取到有效的医保信息，请检查！");
                            //$("#patientId").focus();
                        }

                    } else {
                        layer.alert(obj.msg);
                    }
                },
                error: function (xhr) {
                    layer.alert('调用后台服务异常,' + xhr.toLocaleString());
                }
            });
        };

        $('#cy').on('click', function () {
            var mipsPatiVisitInfoId = $('#mipsPaiVisitInfoId').val();
            if (mipsPatiVisitInfoId != '') {
                openSocket();
                var index = layer.open({
                    type: 1,
                    shade: 0.2,
                    icon: 16,
                    closeBtn: 0,
                    title: false,
                    content: $("#load"),
                    skin: 'layui-layer-molv',
                    area: "25%",
                    success: function (layero, index) {
                        var n = 0;
                        Interval = setInterval(function () {
                            element.progress('demo', n + '%');
                            n = n + 2;
                            if (n >= 100) {
                                n = 0;
                            }
                        }, 100)
                    }
                });
                $.ajax({
                        type: "POST",
                        data: {
                            mipsPatiVisitInfoId: mipsPatiVisitInfoId
                        },
                        url: "/mips/mipsDischarge",
                        success: function (obj) {
                            layer.close(index);
                            clearInterval(Interval);
                            if (obj.code == '0') {
                                console.info(obj);
                                layer.msg('医保出院成功!', {time: 6000, icon: 6});
                                setValue(obj.data)
                            } else {
                                layer.alert('医保出院失败，' + obj.msg);
                            }
                        },
                        error: function (xhr) {
                            layer.alert('调用后台服务异常,' + xhr.responseText);
                        }
                    }
                );
            } else {
                layer.msg('患者信息不能为空！');
            }
        })
        ;
        $('#qxcy').on('click', function () {
            var mipsPatiVisitInfoId = $('#mipsPaiVisitInfoId').val();
            if (mipsPatiVisitInfoId != '') {
                openSocket();
                var index = layer.open({
                    type: 1,
                    shade: 0.2,
                    icon: 16,
                    closeBtn: 0,
                    title: false,
                    content: $("#load"),
                    skin: 'layui-layer-molv',
                    area: "25%",
                    success: function (layero, index) {
                        var n = 0;
                        Interval = setInterval(function () {
                            element.progress('demo', n + '%');
                            n = n + 2;
                            if (n >= 100) {
                                n = 0;
                            }
                        }, 100)
                    }
                });
                $.ajax({
                        type: "POST",
                        data: {
                            mipsPatiVisitInfoId: mipsPatiVisitInfoId
                        },
                        url: "/mips/mipsCancelDischarge",
                        success: function (obj) {
                            clearInterval(Interval);
                            console.info(obj);
                            layer.close(index);
                            if (obj.code == '0') {
                                layer.msg('取消医保出院成功!', {time: 6000, icon: 6});
                                setValue(obj.data)
                            } else {
                                layer.alert('取消医保出院失败，' + obj.msg);
                            }
                        },
                        error: function (xhr) {
                            layer.alert('调用后台服务异常,' + xhr.responseText);
                        }
                    }
                );
            } else {
                layer.msg('患者信息不能为空！');
            }
        });

        $('#mxsc').on('click', function () {
            var mipsPatiVisitInfoId = $('#mipsPaiVisitInfoId').val();
            if (mipsPatiVisitInfoId != '') {
                openSocket();
                var index = layer.open({
                    type: 1,
                    shade: 0.2,
                    icon: 16,
                    closeBtn: 0,
                    title: false,
                    content: $("#load"),
                    skin: 'layui-layer-molv',
                    area: "25%",
                    success: function (layero, index) {
                        var n = 0;
                        Interval = setInterval(function () {
                            element.progress('demo', n + '%');
                            n = n + 2;
                            if (n >= 100) {
                                n = 0;
                            }
                        }, 100)
                    }
                });
                $.ajax({
                    type: "POST",
                    data: {
                        mipsPatiVisitInfoId: mipsPatiVisitInfoId
                    },
                    url: "/mips/mipsUploadBillDetail",
                    success: function (obj) {
                        clearInterval(Interval);
                        console.info(obj);
                        layer.close(index);
                        if (obj.code == '0') {
                            layer.msg('明细上传成功!', {time: 6000, icon: 6});
                        } else {
                            if (obj.code == "103") {
                                layer.msg(obj.msg, {time: 6000, icon: 1});
                            } else if (obj.code == "101") {
                                var msg = "";
                                $.each(obj.data, function (i, item) {
                                    msg += item.failMsg;
                                })
                                layer.alert('明细上传失败，' + msg);
                            } else {
                                layer.alert('明细上传失败，' + obj.msg);
                            }
                        }
                    },
                    error: function (xhr) {
                        layer.alert('调用后台服务异常,' + xhr.responseText);
                    }
                });
            } else {
                layer.msg('患者信息不能为空！');
            }
        });

        $('#qxmxsc').on('click', function () {
            var mipsPatiVisitInfoId = $('#mipsPaiVisitInfoId').val();
            if (mipsPatiVisitInfoId != '') {
                openSocket();
                var index = layer.open({
                    type: 1,
                    shade: 0.2,
                    icon: 16,
                    closeBtn: 0,
                    title: false,
                    content: $("#load"),
                    skin: 'layui-layer-molv',
                    area: "25%",
                    success: function (layero, index) {
                        var n = 0;
                        Interval = setInterval(function () {
                            element.progress('demo', n + '%');
                            n = n + 2;
                            if (n >= 100) {
                                n = 0;
                            }
                        }, 100)
                    }
                });
                $.ajax({
                    type: "POST",
                    data: {
                        mipsPatiVisitInfoId: mipsPatiVisitInfoId
                    },
                    url: "/mips/mipsCancelUploadBillDetail",
                    success: function (obj) {
                        clearInterval(Interval);
                        console.info(obj);
                        layer.close(index);
                        if (obj.code == '0') {
                            layer.msg('取消明细上传成功!', {time: 6000, icon: 6});
                        } else {
                            layer.alert('取消明细上传失败，' + obj.msg);
                        }
                    },
                    error: function (xhr) {
                        layer.alert('调用后台服务异常,' + xhr.responseText);
                    }
                });
            } else {
                layer.msg('患者信息不能为空！');
            }
        });

        function setValue(obj) {
            $('#name').val(obj.name);
            $('#pid').val(obj.patientId);
            if (obj.isDischarge == "0") {
                $('#zyzt').val("在院");
                $('#cy').removeClass("layui-btn-disabled");
                $('#cy').addClass("layui-btn-normal").prop("disabled", false);
                $('#qxcy').addClass("layui-btn-disabled").prop("disabled", true);
                ;
            } else {
                $('#zyzt').val("已出院");
                $('#qxcy').removeClass("layui-btn-disabled");
                $("#qxcy").addClass("layui-btn-normal").prop("disabled", false);
                $("#cy").addClass("layui-btn-disabled").prop("disabled", true);
            }
            $('#fb').val(obj.insuranceSystemCode);
            $('#zycs').val(obj.visitId);
            $('#xb').val(obj.sex);
            $('#kh').val(obj.personalNo);
            if (obj.birthday) {
                $('#csrq').val(new Date(obj.birthday).Format("yyyy-MM-dd"));
            }
            $('#ryrq').val(new Date(obj.inDate).Format("yyyy-MM-dd hh:mm:ss"));
            $('#mipsPaiVisitInfoId').val(obj.id);

        }

        //日期格式化，将毫秒转为 XXXX-XX-XX 的格式
        Date.prototype.Format = function (fmt) {
            var o = {
                "M+": this.getMonth() + 1, // 月份
                "d+": this.getDate(), // 日
                "h+": this.getHours(), // 小时
                "m+": this.getMinutes(), // 分
                "s+": this.getSeconds(), // 秒
                "q+": Math.floor((this.getMonth() + 3) / 3), // 季度
                "S": this.getMilliseconds()
                // 毫秒
            };
            if (/(y+)/.test(fmt))
                fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "")
                    .substr(4 - RegExp.$1.length));
            for (var k in o)
                if (new RegExp("(" + k + ")").test(fmt))
                    fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k])
                        : (("00" + o[k]).substr(("" + o[k]).length)));
            return fmt;

        };

        var socket;

        function openSocket() {

            $('body').find('text').remove();
            if (typeof (WebSocket) == "undefined") {
                console.log("您的浏览器不支持WebSocket");
            } else {

                var socketUrl = "http://localhost:9999/imserver";
                socketUrl = socketUrl.replace("https", "ws").replace("http", "ws");
                if (socket != null) {
                    socket.close();
                    socket = null;
                }
                console.info(socketUrl);
                socket = new WebSocket(socketUrl);
                //打开事件
                socket.onopen = function () {
                    console.log("正在读取处理进度...");
                    $('#msg').text('正在读取处理进度...');
                    $('body').prepend('<text class="text">正在读取处理进度...</text><br/>');
                };
                //获得消息事件
                socket.onmessage = function (msg) {
                    console.log(msg.data);
                    $('#msg').text(msg.data);
                    $('<text class="text"><br/></text>').text(msg.data).prependTo('body');
                    //$('body').prependTo('<text class="text"><xmp>'+msg.data+'</xmp></text><br/>');

                    //发现消息进入    开始处理前端触发逻辑
                };
                //关闭事件
                socket.onclose = function () {
                    console.log("websocket已关闭");
                };
                //发生了错误事件
                socket.onerror = function () {
                    console.log("websocket发生了错误");
                }
            }
        }
    })
    ;
</script>


</body>
</html>
